<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增酒店信息')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: select2-css"/>
    <th:block th:include="include :: bootstrap-select-css"/>
</head>
<style>
    input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    input[type="number"] {
        -moz-appearance: textfield;
    }

</style>
<body>
<div class="wrapper wrapper-content animated fadeInRight ibox-content" id="dv">
    <form class="form-horizontal m" id="form-hotel-add" AUTOCOMPLETE="OFF">
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">选择日：</label>
                    <div class="col-sm-8">
                        <select name="fillDay" onchange="lastDay()" id="fillDay" class="form-control noselect2">
                            <option value="">请选择</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4" id="roomSum">客房收入小计（0）元</h4>
        <input type="hidden" name="monthId" id="monthId" th:value="${monthId}">
        <input type="hidden" name="roomSum">
        <input type="hidden" name="restaurant">
        <input type="hidden" name="variableCost">
        <input type="hidden" name="totalOperatingRevenue">
        <input type="hidden" name="fixedCost">
        <input type="hidden" name="profit">
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">房费收入：</label>
                    <div class="col-sm-8">
                        <input id="roomRate" name="roomRate" class="form-control" type="number"
                               placeholder="请输入房费收入" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">大堂吧：</label>
                    <div class="col-sm-8">
                        <input id="hall" name="hall" class="form-control" type="number" placeholder="请输入大堂吧收入"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">客吧收入：</label>
                    <div class="col-sm-8">
                        <input id="guestBar" name="guestBar" class="form-control" type="number"
                               placeholder="请输入客吧收入" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">洗衣：</label>
                    <div class="col-sm-8">
                        <input id="laundry" name="laundry" class="form-control" type="number" placeholder="请输入洗衣收入"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">客房赔偿：</label>
                    <div class="col-sm-8">
                        <input id="compensate" name="compensate" class="form-control" type="number"
                               placeholder="请输入客房赔偿" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">客房其他：</label>
                    <div class="col-sm-8">
                        <input id="roomOther" name="roomOther" class="form-control" type="number" placeholder="请输入客房其他"
                               required/>
                    </div>
                </div>
            </div>
        </div>

        <h4 class="form-header h4" id="restaurant">餐饮收入（0）元</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">中餐厅：</label>
                    <div class="col-sm-8">
                        <input id="chineseRestaurant" name="chineseRestaurant" class="form-control" type="number"
                               placeholder="请输入中餐厅收入" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">西餐厅：</label>
                    <div class="col-sm-8">
                        <input id="westernRestaurant" name="westernRestaurant" class="form-control" type="number"
                               placeholder="请输入西餐厅收入"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">宴席：</label>
                    <div class="col-sm-8">
                        <input id="banquets" name="banquets" class="form-control" type="number"
                               placeholder="请输入宴席收入" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">巴厘岛海鲜：</label>
                    <div class="col-sm-8">
                        <input id="buffet" name="buffet" class="form-control" type="number" placeholder="请输入巴厘岛海鲜收入"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">其他收入：</label>
                    <div class="col-sm-8">
                        <input id="otherIncome" name="otherIncome" class="form-control" type="number"
                               placeholder="请输入其他收入" required/>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4">客房相关</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">客房入住数：</label>
                    <div class="col-sm-8">
                        <input id="lodgeNum" name="lodgeNum" class="form-control" type="number"
                               placeholder="请输入客房入住数" required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">客房入住率：</label>
                    <div class="col-sm-8">
                        <input id="occupancy" class="form-control" type="text"
                               required disabled/>
                        <input name="occupancy" class="form-control" type="hidden"/>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4" id="totalOperatingRevenue" style="text-align: right;font-weight: 700;">营业总收入（0）元</h4>
        <h4 class="form-header h4" id="fixedCost">固定费用（0）元</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">人力成本：</label>
                    <div class="col-sm-8">
                        <input id="laborCost" name="laborCost" class="form-control" type="number"
                               placeholder="请输入人力成本" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">租赁费：</label>
                    <div class="col-sm-8">
                        <input id="rental" name="rental" class="form-control" type="number" placeholder="请输入租赁费"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">物管费：</label>
                    <div class="col-sm-8">
                        <input id="propertyManagement" name="propertyManagement" class="form-control" type="number"
                               placeholder="请输入物管费" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">低耗摊销：</label>
                    <div class="col-sm-8">
                        <input id="commonBear" name="commonBear" class="form-control" type="number"
                               placeholder="请输入租赁费"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">资产折旧：</label>
                    <div class="col-sm-8">
                        <input id="assets" name="assets" class="form-control" type="number"
                               placeholder="请输入资产折旧" required/>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4" id="variableCost">变动费用（0）元</h4>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">成本：</label>
                    <div class="col-sm-8">
                        <input id="cost" name="cost" class="form-control" type="number"
                               placeholder="请输入成本" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">水电气能耗：</label>
                    <div class="col-sm-8">
                        <input id="waterAndElectricity" name="waterAndElectricity" class="form-control" type="number"
                               placeholder="水电气能耗"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">广宣费：</label>
                    <div class="col-sm-8">
                        <input id="propaganda" name="propaganda" class="form-control" type="number"
                               placeholder="请输入广宣费" required/>
                    </div>
                </div>
                <div class="col-sm-6">
                    <label class="col-sm-4 control-label">其他：</label>
                    <div class="col-sm-8">
                        <input id="other" name="other" class="form-control" type="number"
                               placeholder="请输入其他"
                               required/>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4" id="profit" style="text-align: right;font-weight: 700;">利润（0）</h4>
    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: select2-js"/>

<script type="text/javascript">
    var prefix = ctx + 'tourismHotel';
    var roomSum;//营业收入小计
    var restaurant;//餐饮收入
    var totalOperatingRevenue;//营业总收入
    var fixedCost;//固定费用
    var variableCost;//变动费用
    var profit;//利润

    $(function () {
        for (var i = 1; i <= 31; i++) {
            $("#fillDay").append("<option value='" + i + "'>" + i + "日" + "</option>")
        }
    });

    $("#lodgeNum").change(function () {
        $("#occupancy").val((Number($("#lodgeNum").val() / 184) * 100).toFixed(2) + "%");
        $("input[name='occupancy']").val(Number($("#lodgeNum").val() / 184).toFixed(4));
    });

    $("input").change(function () {
        calc();
    });

    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#form-hotel-add").serializeArray();
            $.operate.save(prefix + "/add?monthId=" + $("input[name='monthId']").val(), data);
        }
    }

    function lastDay(){
        var day = $("#fillDay").val();
        if(day > 1){
            //ajax取值
            $.ajax({
                cache: true,
                type: "POST",
                url: prefix + "/getLastDayData",
                data: {
                    "budgetId" : $("#monthId").val(),
                    "day" : day - 1
                },
                async: false,
                success: function (data) {
                    $("#hall").val(data.hall);
                    $("#guestBar").val(data.guest_bar);
                    $("#laundry").val(data.laundry);
                    $("#compensate").val(data.compensate);
                    $("#roomOther").val(data.room_other);
                    $("#buffet").val(data.buffet);
                    $("#otherIncome").val(data.other_income);
                    $("#laborCost").val(data.labor_cost);
                    $("#rental").val(data.rental);
                    $("#propertyManagement").val(data.property_management);
                    $("#commonBear").val(data.common_bear);
                    $("#assets").val(data.assets);
                    $("#cost").val(data.cost);
                    $("#waterAndElectricity").val(data.water_and_electricity);
                    $("#propaganda").val(data.propaganda);
                    $("#other").val(data.other);
                    calc();
                },
                error: function (request) {
                }
            });
        }
    }

    function calc(){
        roomSum = (Number($("#roomRate").val()) + Number($("#hall").val()) + Number($("#guestBar").val()) + Number($("#laundry").val()) + Number($("#compensate").val()) + Number($("#roomOther").val())).toFixed(2);
        $("#roomSum").text("客房收入小计（" + roomSum + "）元");
        restaurant = (Number($("#chineseRestaurant").val()) + Number($("#westernRestaurant").val()) + Number($("#banquets").val()) + Number($("#buffet").val()) + Number($("#otherIncome").val())).toFixed(2);
        $("#restaurant").text("餐饮收入（" + restaurant + "）元");
        totalOperatingRevenue = (Number(roomSum) + Number(restaurant)).toFixed(2);
        $("#totalOperatingRevenue").text("营业总收入（" + totalOperatingRevenue + "）元");
        fixedCost = (Number($("#laborCost").val()) + Number($("#rental").val()) + Number($("#propertyManagement").val()) + Number($("#commonBear").val()) + Number($("#assets").val())).toFixed(2);
        $("#fixedCost").text("固定费用（" + fixedCost + "）元");
        variableCost = (Number($("#cost").val()) + Number($("#waterAndElectricity").val()) + Number($("#propaganda").val()) + Number($("#other").val())).toFixed(2);
        $("#variableCost").text("变动费用（" + variableCost + "）元");
        profit = (Number(totalOperatingRevenue) - Number(fixedCost) - Number(variableCost)).toFixed(2);
        $("#profit").text("利润（" + profit + "）");

        $("input[name='roomSum']").val(roomSum);
        $("input[name='restaurant']").val(restaurant);
        $("input[name='totalOperatingRevenue']").val(totalOperatingRevenue);
        $("input[name='fixedCost']").val(fixedCost);
        $("input[name='variableCost']").val(variableCost);
        $("input[name='profit']").val(profit);
    }
</script>

</body>
</html>